<template>
	<view>
		<uni-card v-for="item in dataList" :key="item.id" @click="showDetail(item.id)" :title="`订单号 ` + item.orderNo"
			:extra="showOrderStatusDesc(item.status)">
			<view class="">
				<view class="font-bold">{{ item.hotelName }}</view>
				<view>
					<text>{{ item.roomType }}</text>
				</view>
				<view>
					<text>{{ item.checkInDate }} 至</text>
				</view>
        <view>
          <text>{{ item.checkOutDate }}</text> <text class="font32">·</text> <text class="font-bold">{{ item.roomCount }} 间</text>
        </view>

			</view>
			<template v-slot:actions>
				<view class="text-right padding-right-sm">
            <text class="font32 black-color">‌¥‌{{ item.totalAmount }}</text>
				</view>
			</template>
		</uni-card>
	</view>
</template>

<script setup>
	import {
		showCustomerName
	} from "@/common/api/common.js";
	import {
		showHotelOrderStatus
	} from "@/common/api/hotel.js";
  import { calcNights } from '@/utils/date_utils'

	// 定义 props 接收父组件传递的数组
	const props = defineProps({
		dataList: {
			type: Array,
			required: true,
		},
		loading: {
			type: Boolean,
			default: false
		}
	});

	function showDetail(id) {
		console.log('/pages/hotel/HotelOrderDetail?id=' + id)
		uni.navigateTo({
			url: '/pages/hotel/HotelOrderDetail?id=' + id
		})
	}

	function showPsgName(info) {
		return showPassengerName(info, 0);
	}

	function showCtmName(info) {
		return showCustomerName(info, 0);
	}

	function showOrderStatusDesc(orderStatus) {
		return showHotelOrderStatus(orderStatus)
	}
</script>

<style lang="scss">
	.container {
		display: grid;
		// height: 150rpx;
		grid-template-columns: 3fr 7fr;
	}
</style>
